// https://web.dev/articles/fcp?hl=zh-cn
// import { lazyReportBatch } from '../report'
/**
FP(first-paint)，从页面加载开始到第一个像素绘制到屏幕上的时间。其实把 FP 理解成白屏时间也是没问题的。
 * 上报数据 格式
{
    duration: 0,
    entryType: "paint",
    name: "first-contentful-paint",
    startTime: 459, // fp 时间
	type: 'performance', // 上报大类型
	subType: 'first-contentful-paint', // 上报子类型
	pageUrl: window.location.href // 页面地址
}
 */

export const observerFP = () => {
	const entryHandler = (entryList) => {
		for (const entry of entryList.getEntries()) {
			if (entry.name === 'first-paint') {
				// 断开观察者：断开observer的连接，防止继续观察性能事件
				observer.disconnect()
				console.log('entry', entry)
				const json = entry.toJSON()
				console.log('json', json)

				// 构建上报数据
				const reportData = {
					...json,
					type: 'performance',
					subType: entry.name,
					pageUrl: window.location.href
				}
				console.log('reportData', reportData)
				// TODO: 数据上报
			}
		}
	}
	const observer = new PerformanceObserver(entryHandler)
	// buffered 属性表示是否观察缓存数据，也就是说观察代码添加时机比事情触发时机晚也没关系。
	observer.observe({ type: 'paint', buffered: true })
}
